<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="天地图" />
    <title>天地图</title>
   
    <script type="text/javascript" src="http://api.tianditu.gov.cn/api?v=4.0"></script>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
    <style type="text/css">
        body,
        html {
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "Microsoft YaHei"
        }

        #mapDiv {
            width: 100%;
            height: 100%
        }

        input,
        b,
        p {
            margin-left: 5px;
            font-size: 14px
        }
    </style>
    <script>
        var map;
        var zoom = 6;

        function onLoad() {
            //初始化地图对象
            map = new T.Map("mapDiv");
            //设置显示地图的中心点和级别
            map.centerAndZoom(new T.LngLat(116.40969, 39.89945), zoom);

            //创建标注对象
            var marker = new T.Marker(new T.LngLat(116.411794, 39.9068), {
                draggable: true


            });
            //向地图上添加标注
            map.addOverLay(marker);
            console.log(marker.getLngLat().lat);
            marker.addEventListener("dragend", MapMoveend);

            function MapMoveend(e) {
                console.log(marker.getLngLat());


                $.ajax({
                    type: "get",
                    url : "http://api.tianditu.gov.cn/geocoder?postStr={'lon':" + marker.getLngLat().lng +
                    ",'lat':" + marker.getLngLat().lat + ",'ver':1}&type=geocode",
                    success: function (result) {
                        console.log(result);
                    }


                })

            }

        }
    </script>
</head>

<body onLoad="onLoad()">
    <div id="mapDiv"></div>
</body>

</html>